<template>
	<view>
		<view class="cu-bar bg-white solid-bottom margin-top">
			<view class="action">
				<text class="cuIcon-title text-orange "></text> 已经报名的用户
			</view>
		</view>
		<view class="cu-list menu-avatar">

			<view class="cu-item cur" v-for="(item,index) in applyedUsers" :key="index">
				<view class="cu-avatar radius lg"
					:style="item.potrait">
					<view class="cu-tag badge"></view>
				</view>
				<view class="content">
					<view>
						<view class="text-cut">{{item.userName}}</view>
					</view>
					
					<view class="text-gray text-sm flex" v-if="signedUsers.indexOf(item.userName)!=-1">
						<view class="text-cut text-olive" > {{item.userName}}：<text
								class="cuIcon-locationfill text-orange margin-right-xs"></text> 我签到了！！！
						</view>
					</view>
					
				</view>
				<view class="action">
					<view class="text-grey text-xs">22:20</view>
				</view>
			</view>
		</view>

		<!-- -------------------------------------- -->

		<view class="cu-bar bg-white solid-bottom margin-top">
			<view class="action">
				<text class="cuIcon-title text-orange "></text> 申请加入活动的用户
			</view>
		</view>
		<view class="cu-list menu-avatar">
			<view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item,index) in users"
				:key="index" @touchstart="ListTouchStart" @touchmove="ListTouchMove" @touchend="ListTouchEnd"
				:data-target="'move-box-' + index">
				<view class="cu-avatar round lg"
					:style="[{backgroundImage:'url(https://ossweb-img.qq.com/images/lol/web201310/skin/big2100'+ (index+2) +'.jpg)'}]">
				</view>
				<view class="content">
					<view class="text-grey">{{item.username}}</view>

				</view>

				<view class="move">
					<view @click="disagree(item.username)" class="bg-grey">驳回</view>
					<view @click="agree(item.username)" class="bg-red">同意</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				modalName: null,
				activityName: '',
				users: [],
				applyedUsers: [],
				signedUsers:[]

			}
		},
		onLoad(option) { //获取参数
			this.activityName = option.activityname
		},
		onShow() {
			this.getDetail()
			this.getApplyedUser()
			this.getSignedUser()
		},
		methods: {
			async getDetail() {
				const res = await this.$myRequest({
					url: '/Manage/getAuditUser',
					data: {
						activityName: this.activityName
					}
				})
				this.users = res.data
			},

			// ListTouch触摸开始
			ListTouchStart(e) {
				this.listTouchStart = e.touches[0].pageX
			},

			// ListTouch计算方向
			ListTouchMove(e) {
				this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
			},

			// ListTouch计算滚动
			ListTouchEnd(e) {
				if (this.listTouchDirection == 'left') {
					this.modalName = e.currentTarget.dataset.target
				} else {
					this.modalName = null
				}
				this.listTouchDirection = null
			},
			async agree(username) {
				const res = await this.$myRequest({
					url: '/Audit/auditUser',
					data: {
						result: "success",
						activityname: this.activityName,
						name: username

					}
				})
				console.log(res.statusCode)
				if (res.statusCode == 200) {
					uni.showToast({
						title: "同意申请"
					})
					this.getDetail()
				} else {
					uni.showToast({
						title: "请求服务器失败"
					})
				}

			},
			async disagree(username) {
				const res = await this.$myRequest({
					url: '/Audit/auditUser',
					data: {
						result: "fail",
						activityname: this.activityName,
						name: username

					}
				})

				if (res.statusCode == 200) {
					uni.showToast({
						title: "驳回申请"
					})
					this.getDetail()
				} else {
					uni.showToast({
						title: "请求服务器失败"
					})
				}
			},
			async getApplyedUser() {
				const res = await this.$myRequest({
					url: '/Manage/getApplyedUser',
					data: {
						activityName: this.activityName

					}
				})
				let list=res.data;
				for(let i=0;i<list.length;i++){
					list[i].potrait="background-image:url("+list[i].potrait+");"
				}
				this.applyedUsers = list
			},
			async getSignedUser(){
				const res = await this.$myRequest({
					url: '/sign/showSignedUser',
					data: {
						title: this.activityName
				
					}
				})
				this.signedUsers=res.data
			}
		}
	}
</script>

<style>

</style>
